<template>
  <div class="layout">
    <div class="layout-box">
      <el-row class="header">
        <Config @changeVideoStartTime="changeVideoStartTime" :forms="form" @allLog="allLog" :openWholeRecord="openWholeRecord"   />
      </el-row>
      <div class="content">
        <slot />
      </div>
    </div>
  </div>
</template>
<script>
import Config from './components/Config.vue'
export default {
  components: {
    Config
  },
  props:{
    videoPlayStartTime: {
      type: Date,
      default: new Date('00:00:00'),
    },
    form: {
      type: Object,
      default: {}
    },
    openWholeRecord: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    key: {
      get(){
        return this.$route.fullPath
      }
    }
  },
  mounted() {
    console.log('this.form666666666666',this.form)
  },
  methods: {
    changeVideoStartTime(value) {
      this.$emit('update:videoPlayStartTime', value)
    },
    allLog(value){
      this.$emit('allLog', value)
    }
  }
}
</script>
<style  scoped>
.wraper {
  margin: 0px auto;
  height: 500px;
  overflow: hidden;
}
.layout {
  min-width: 1024px;
  padding: 10px;
  box-sizing: border-box;
  height: 100%;
  overflow: hidden;
  font-size: 13px;
  border: 1px solid #ccc;
  height: 100%;
}
.layout-box{
  height: 100%;
}
  .header {
    height: 32px;
    overflow: hidden;
  }
  .content {
    padding: 5px 0;
    box-sizing: border-box;
    height: calc(100% - 20px);
    width: 100%;

  }
  /deep/ .el-table--mini th,
  /deep/ .el-table--mini td {
    padding: 0px;
    font-size: 11px;
  }
</style>
